<%@ taglib uri="http://jakarta.apache.org/struts/tags-html" prefix="html" %>
<%@ taglib uri="http://jakarta.apache.org/struts/tags-bean" prefix="bean" %>
<%@ taglib uri="http://jakarta.apache.org/struts/tags-logic" prefix="logic" %>

<%@ page contentType="text/html; charset=UTF-8" pageEncoding="UTF-8" %>
<html:html>
<head>
	<link rel="stylesheet" type="text/css" href="<%= request.getContextPath() %>/css/sampleForm.css" />
	<link rel="stylesheet" type="text/css" href="<%= request.getContextPath() %>/css/me.css" />	
	<title>บันทึกใบขอเบิกใช้สินค้า, วัตถุดิบ (BCStkIssue2, BCStkIssueSub2)</title>
	<script type='text/javascript' src='/ittl/dwr/interface/BCProjectService.js'></script>
  	<script type='text/javascript' src='/ittl/dwr/interface/ItemLocationService.js'></script>
  	<script type='text/javascript' src='/ittl/dwr/engine.js'></script>
  	<script type='text/javascript' src='/ittl/dwr/util.js'></script>

	<script type='text/javascript' src='<%= request.getContextPath() %>/css/autocomplete/lib/jquery.js' ></script>
	<script type='text/javascript' src='<%= request.getContextPath() %>/css/autocomplete/lib/jquery.bgiframe.min.js' ></script>
	<script type='text/javascript' src='<%= request.getContextPath() %>/css/autocomplete/lib/jquery.ajaxQueue.js' ></script>
	<script type='text/javascript' src='<%= request.getContextPath() %>/css/autocomplete/lib/thickbox-compressed.js' ></script>
	<script type='text/javascript' src='<%= request.getContextPath() %>/css/autocomplete/lib/jquery.autocomplete.js' ></script>
	
	<script type='text/javascript' src='<%= request.getContextPath() %>/css/autocomplete/data/localdata.js' ></script>
	<script type='text/javascript' src='<%= request.getContextPath() %>/css/autocomplete/data/localdata2.js' ></script>
	<script type='text/javascript' src='<%= request.getContextPath() %>/css/autocomplete/data/localdata3.js' ></script>
	
	<link rel="stylesheet" type="text/css" href="<%= request.getContextPath() %>/css/autocomplete/css/mainOLD.css" />
	<link rel="stylesheet" type="text/css" href="<%= request.getContextPath() %>/css/autocomplete/css/jquery.autocomplete.css" />
	<link rel="stylesheet" type="text/css" href="<%= request.getContextPath() %>/css/autocomplete/css/thickbox.css" />
 
 	<script type="text/javascript" src="<%= request.getContextPath() %>/stockRequest/jquery.validate.js" ></script>
 
<script language="JavaScript">


$(document).ready(function() {
/*
	$("#form1").validate({
		
		rules: {
			qty1a: {
				required: 	true,
				number:		true
			}		
		},
		messages: {
			qty1a: "required."
		},
		submitHandler: function() {
			alert("submitted!22");
			//form.submit();
		},
		// the errorPlacement has to take the table layout into account
		errorPlacement: function(error, element) {			
			if ( element.is(":radio") )
				error.appendTo( element.parent().next().next() );
			else if ( element.is(":checkbox") )
				error.appendTo ( element.next() );
			else
				error.appendTo( element.parent().next() );
				alert("element.parent().next()="+element.parent().next());
		}		
	});*/
		
	$("#suggest1").focus().autocomplete(cities);
	
	$("#suggestProject").autocomplete(projects, {
		matchContains: "word",
		minChars: 0
	});
	
	$("#suggestCode1").autocomplete(codes, {
		matchContains: "word",
		minChars: 0
	});
	
	$("#suggestCode2").autocomplete(codes, {
		matchContains: "word",
		minChars: 0
	});
	
	$("#suggestCode3").autocomplete(codes, {
		matchContains: "word",
		minChars: 0
	});
	$("#suggestCode4").autocomplete(codes, {
		matchContains: "word",
		minChars: 0
	});
	$("#suggestCode5").autocomplete(codes, {
		matchContains: "word",
		minChars: 0
	});
	
	$("#suggest11").autocomplete(cities, {
		matchContains: true,
		minChars: 0
	});

    $("#itemName5").autocomplete(cities, { scroll: true } );

	$("#suggest4").autocomplete(emails, {
		minChars: 0,
		width: 3100,
		matchContains: true,
		autoFill: false,
		formatItem: function(row, i, max) {
			return i + "/" + max + ": \"" + row.name + "\" [" + row.to + "]";
		},
		formatMatch: function(row, i, max) {
			return row.name + " " + row.to;
		},
		formatResult: function(row) {
			return row.to;
		}
	});
/*
	$("#suggest5").autocomplete(items, {
		minChars: 0,		
		matchContains: true,
		autoFill: false,
		formatItem: function(row, i, max) {
			return row.code + ":  [" + row.name + "]";
		},
		formatMatch: function(row, i, max) {
			return row.name + " " + row.code;
		},
		formatResult: function(row) {
			return row.code;
		}
	});
*/	
});

</script>  

<!--  ส่วนที่ 2 -->
<script language="JavaScript">
var inputNo;
var itemName = "";
var code;
var itemName;
var whCode;
var shelfCode;
var shelfName;

function getAlert() {
	alert("before Test !!");
	alert("after Test !!");
	alert(document.getElementById("suggestCode1").value);
	alert(document.getElementByName("itemCode1").value);
		
	alert(document.form1.itemCode1.value);
	alert(document.form1.suggestCode1.value);

	for(var i=0; i< document.form1.elements.length; i++) {
		alert(document.form1.elements[i].value)
	}	
}

function getAlert2() {
	alert("before Test !!");
	alert("after Test !!");
	alert("aid= "+document.getElementById("aid").value);	
	alert("anm= "+document.getElementsByName("anm").value);
	
	alert(document.getElementById("suggestCode1").value);
	alert(document.getElementsByName("itemCode1").value);
		
	alert(document.form1.itemCode1.value);
	alert(document.form1.suggestCode1.value);

	for(var i=0; i< document.form1.elements.length; i++) {
		alert(document.form1.elements[i].value)
	}	
}

function getData(var1,x) {
	//alert("bcitem");
	inputNo = x;
	ItemLocationService.getData( var1, loadinfo );
	  
}

<!--  ส่วนที่ 3 -->
function loadinfo(data)
{
	code 	  = data.code;
	itemName  = data.name1;
	whCode 	  = data.whCode;
	shelfCode = data.shelfCode;
	shelfName = data.shelfName;
	unitCode = data.unitCode;
	unitName = data.unitName;
	
	switch(inputNo) {
	case 1:	dwr.util.setValue("itemCode1", code);
			dwr.util.setValue("itemName1", itemName);
			dwr.util.setValue("whCode1", whCode);
			dwr.util.setValue("whCode11", whCode);
			dwr.util.setValue("unitCode1", unitCode);
			dwr.util.setValue("unitName1", unitName);
			redirectN(0, document.getElementById('shCode1'));					
			break;
	case 2:	dwr.util.setValue("itemCode2", code);
			dwr.util.setValue("itemName2", itemName);
			dwr.util.setValue("whCode2", whCode);			
			dwr.util.setValue("unitCode2", unitCode);
			dwr.util.setValue("unitName2", unitName);
			redirectN(0, document.getElementById('shCode2'));			
			break;
	case 3:	dwr.util.setValue("itemCode3", code);
			dwr.util.setValue("itemName3", itemName);
			dwr.util.setValue("whCode3", whCode);			
			dwr.util.setValue("unitCode3", unitCode);
			dwr.util.setValue("unitName3", unitName);
			redirectN(0, document.getElementById('shCode3'));			
			break;
	case 4:	dwr.util.setValue("itemCode4", code);
			dwr.util.setValue("itemName4", itemName);
			dwr.util.setValue("whCode4", whCode);			
			dwr.util.setValue("unitCode4", unitCode);
			dwr.util.setValue("unitName4", unitName);
			redirectN(0, document.getElementById('shCode4'));			
			break;
	case 5:	dwr.util.setValue("itemCode5", code);
			dwr.util.setValue("itemName5", itemName);
			dwr.util.setValue("whCode5", whCode);			
			dwr.util.setValue("unitCode5", unitCode);
			dwr.util.setValue("unitName5", unitName);
			redirectN(0, document.getElementById('shCode5'));//ใช้ document.form1.shelfCode5 จะทำงานได้บน IE แต่ไม่ไได้บน FF			
			break;
	}
	//displayShelfName();
	

//	alert("shelfName.length ="+shelfName.length );
//	alert("shelfName[0] ="+shelfName[0] );

//	alert("shelfCode.length ="+shelfCode.length );
//	alert("shelfCode[0] ="+shelfCode[0] );	
}
function displayShelfName() {
//	alert("whCode = "+whCode );
//	alert("shelfName = "+shelfName );
}

function redirectN(x, tempN){
	
	var groupsN=5;//document.form1.shelfCode1.options.length
	var groupN=new Array(groupsN);
	for (i=0; i<groupsN; i++)
		groupN[i]=new Array();

	//var tempN=document.form1.shelfCode1;	
	//alert("tempN.options.length-1 = "+(tempN.options.length-1));
	for (m=tempN.options.length-1;m>=0;m--) {
		//alert(tempN.options[m]);
		tempN.options[m]=null;
	}
	
	if(shelfName != null) {
		for (i=0; i<shelfName.length; i++) {
			groupN[0][i]=new Option(shelfName[i], shelfCode[i]);
		}
					
		for (i=0;i<groupN[x].length;i++){
			text = groupN[x][i].value+":"+groupN[x][i].text;
			tempN.options[i]=new Option(text,groupN[x][i].value);
		}
		tempN.options[0].selected=true;
	}
}

</script>
<!--  ส่วนที่ 2 -->
<script language="JavaScript">

function getProject() {
	//alert("bcproject"+form1.projectCode.value);
	BCProjectService.getProject( form1.projectCode.value, loadinfoProject );
	  
}

<!--  ส่วนที่ 3 -->
function loadinfoProject(project)
{	
	//dwr.util.setValue("projectCode", project.name);
	dwr.util.setValue("projectName", project.name);	
		     
}
</script>	
<script type="text/javascript">
function alertValue() {
	alert(document.getElementById('htmlElementTest').value)
}
</script>
<script type="text/javascript">
	function checkform(form1) {
		
		if(form1.docNo.value=="") {
			alert("กรุณาใส่เลขที่เอกสาร");			
			form1.docNo.focus();
			return false;
		}else if(form1.orderNo.value=="") {
			alert("กรุณาใส่เลขที่คำสั่งซื้อ (order)");			
			form1.orderNo.focus();
			return false;
		}else if(form1.projectCode.value=="") {
			alert("กรุณาใส่เลขงบโครงการ");			
			form1.projectCode.focus();
			return false;
		}else if(form1.personCode.value=="") {
			alert("กรุณาใส่รหัสผู้เบิก");			
			form1.personCode.focus();
			return false;
		}else if(form1.shelfCode1.value=="") {
			alert("กรุณาตรวจสอบรหัสสินค้าที่ 1 อีกครั้ง");			
			form1.itemCode1.focus();
			return false;			 
		}else if(form1.shelfCode1.value!="") {
			alert(isNaN(form1.qty1.value));
			alert("IsNumeric(form1.qty1.value)="+IsNumeric(form1.qty1.value));
			if(form1.itemName1.value=="") {
				alert("กรุณาตรวจสอบชื่อสินค้าที่ 1 อีกครั้ง");							
				form1.itemName1.focus();
				return false;
			}else if(IsNumeric(form1.qty1.value)) {
				alert("กรุณาใส่ตัวเลข");							
				form1.qty1.focus();
				return false;				
			}
		}else if(form1.shelfCode2.value=="") {
			alert("กรุณาตรวจสอบรหัสสินค้าที่ 2 อีกครั้ง");			
			form1.itemCode2.focus();
			return false;			 
		}else if(form1.shelfCode3.value=="") {
			alert("กรุณาตรวจสอบรหัสสินค้าที่ 3 อีกครั้ง");			
			form1.itemCode3.focus();
			return false;			 
		}else if(form1.shelfCode4.value=="") {
			alert("กรุณาตรวจสอบรหัสสินค้าที่ 4 อีกครั้ง");			
			form1.itemCode4.focus();
			return false;			 
		}else if(form1.shelfCode5.value=="") {
			alert("กรุณาตรวจสอบรหัสสินค้าที่ 5 อีกครั้ง");			
			form1.itemCode5.focus();
			return false;			 
		}

		
		return true;
	}
</script>
</head>
<body>
			
	<div style="background: #FFFFFF;">
	<p align="center" id="titleIssueType">ประเภทการเบิก : ${issueTypeName}</p>
	<p align="center">แผนก  : ${departCode }</p>	
	
	<html:form action="/StkReq.do?mode=add" styleId="form1" onsubmit="return checkform(this);" >
	
        <html:hidden property="departCode" value="${departCode }" />
        <html:hidden property="issueType" value="${issueType}" />
	<div id="userPw01">
	<fieldset>
		<legend><b>ข้อมูลใบขอเบิกใช้สินค้า, วัตถุดิบ</b></legend><br /> 
		   <table border="0">
			<tr>
				<td width="150px"><label> เลขที่เอกสาร </label></td>
				<td><html:text property="docNo" maxlength="20" value="${docNo}" /></td>
				<td><html:errors property="DocNoMissing" />
 
				</td>
			</tr>
			<tr>
				<td><label>เลขที่คำสั่งซื้อ </label></td>
				<td><html:text property="orderNo" maxlength="20" value=""/></td>
				<td> </td>
			</tr>			
							
 			<tr>
 				<td><label>aเลขงบ(โครงการ)</label></td>
 				<td><html:text property="projectCode" value="" onblur="getProject()" styleId="suggestProject" />
 					<input type="hidden" name="projectName" value="" /> 
 				</td>
 					
 			</tr>
 			<tr>
 				<td><label>ผู้เบิก</label></td>
 				<td><html:text property="personCode" maxlength="50" value="${userName}" /></td>
 					
 			</tr>
 			<tr>
 				<td><label>หมายเหตุ</label></td>
 				<td><html:text property="myDescription" maxlength="200" value=""/></td>
 					
 			</tr>
 			 			 			 				 							
		</table>
     </fieldset></div>
    <div id="items"> 
     <fieldset>
     	<legend><b>รายการสินค้า, วัตถุดิบ</b></legend><br />
		<table border="0" >
			<tr>
			  <td width="120" align="center"><label>รหัสสินค้า</label></td>
			  <td width="330" align="center"><label>ชื่อรายการ</label></td>				
			  <td width="60"  align="center"><label>ที่เก็บ</label></td>
			  <td width="70"  align="center"><label>หน่วยนับ</label></td>
			  <td width="60"  align="center"><label>จำนวน</label></td>
			  <td></td>				
			</tr>
			<tr>				
			  	<td><html:text property="itemCode1" value="" size="15" onblur="getData(document.getElementById('suggestCode1').value,1)" styleId="suggestCode1" /></td>
				<td><html:text property="itemName1" value="" maxlength="200" size="50" styleId="suggest11" /><html:hidden property="whCode1" /></td>				
				<td><select name="shelfCode1" id="shCode1"></select></td>
				<td align="center"><LABEL id="unitName1" ></LABEL><html:hidden property="unitCode1" value="" /></td>
				<td><html:text property="qty1" value=""  maxlength="5" size="5" /></td>
				<td></td>
			</tr>
			<tr>				
				<td><html:text property="itemCode2" value="" size="15" onblur="getData(document.getElementById('suggestCode2').value,2)" styleId="suggestCode2" /></td>
				<td><html:text property="itemName2" value="" maxlength="200" size="50" styleId="suggest12" /><html:hidden property="whCode2" value="" /></td>
				<td><select name="shelfCode2" id="shCode2"></select></td>
			    <td align="center"><LABEL id="unitName2" ></LABEL><html:hidden property="unitCode2" value="" /></td>
				<td><html:text property="qty2" value="" maxlength="5" size="5"/></td>
				<td></td>
			</tr>
			<tr>				
				<td><html:text property="itemCode3" value="" size="15" onblur="getData(document.getElementById('suggestCode3').value,3)" styleId="suggestCode3" /></td>
				<td><html:text property="itemName3" value="" maxlength="200" size="50" styleId="suggest13" /><html:hidden property="whCode3" value="" /></td>
				<td><select name="shelfCode3" id="shCode3"></select></td>
				<td align="center"><LABEL id="unitName3" ></LABEL><html:hidden property="unitCode3" value="" /></td>
				<td><html:text property="qty3" value="" maxlength="5" size="5"/></td>
				<td></td>
			</tr>
			<tr>				
				<td><html:text property="itemCode4" value="" size="15" onblur="getData(document.getElementById('suggestCode4').value,4)" styleId="suggestCode4" /></td>
				<td><html:text property="itemName4" value="" maxlength="200" size="50" styleId="suggest4" /><html:hidden property="whCode4" value="" /></td>
				<td><select name="shelfCode4" id="shCode4"></select></td>
				<td align="center"><LABEL id="unitName4" ></LABEL><html:hidden property="unitCode4" value="" /></td>
				<td><html:text property="qty4" value="" maxlength="5" size="5" /></td>
				<td></td>
			</tr>
			<tr>				
				<td><html:text property="itemCode5" value="" size="15" onblur="getData(document.getElementById('suggestCode5').value,5)" styleId="suggestCode5" /></td>
				<td><html:text property="itemName5" value="" maxlength="200" size="50" styleId="suggest5" /><html:hidden property="whCode5" value="" /></td>
				<td><select name="shelfCode5" id="shCode5"></select></td>
				<td align="center"><LABEL id="unitName5" > </LABEL><html:hidden property="unitCode5" value="" /></td>
				<td><html:text property="qty5" value="" maxlength="5" size="5"/></td>
				<td></td>
			</tr>
		</table>     	
     </fieldset>
 	</div>
 	<html:submit />    	    	    	
    </html:form>
    </div>
         
</body>
</html:html>
